use(
    [
        "public/javascripts/service/sub_billService.js",
        "public/javascripts/widget/slider/slider.js",
        "public/javascripts/widget/mtable/mtable.js",
        "public/javascripts/sub_bill/subBillView.js",
        "public/javascripts/widget/dialog/dialog.js",
        "public/javascripts/widget/prompt/prompt.js"
    ],
    function (sub_billService, SliderComponent, mtableModule, subBillView, DialogComponent, PromptComponent) {
        var PageComponent = React.createClass({
            mtable: null,
            restData: {
                'q': '',
                'pageIndex': 1,
                'pageSize': 10
            },
            componentDidMount: function () {
                var _this = this;

                _this.search();

                _this.mtable = mtableModule.init('#mtable');
            },
            receiveMsg: function (data) {

            },
            getInitialState: function () {
                var _this = this;
                return this.props ? this.props : {};
            },
            render: function () {
                var data = this.state.data;
                var _this = this,
                    list = this.state.list ? this.state.list : [],
                    Browser = typeof window != 'undefined',
                    totalResult = _this.state.totalResult;
                return ~init;
            },
            refresh: function (res) {
                var _this = this,
                    data = res.data,
                    arr = [];

                for (var i = 0, l = data.length; i < l; i++) {
                    arr.push(data[i]);
                }
                _this.setState({list: arr, 'totalResult': res.pagination.totalResult});
            },
            search: function (isReset) {
                var _this = this;

                _this.restData.q = $('#search').val();

                isReset ? _this.restData.pageIndex = 1 : '';

                var config = {
                    'urlParams': {
                        'q': _this.restData.q,
                        'pageIndex': _this.restData.pageIndex,
                        'pageSize': _this.restData.pageSize
                    }
                };

                sub_billService.subAccount(config, function (res) {
                    if (res.errorCode === 0) {
                        _this.refresh(res);

                        _this.mtable.cancelSelect();
                    }
                });
            },
            enter: function (event) {
                var _this = this;

                if (event.keyCode != 13) {
                    return;
                }

                _this.search(true);
            },
            add: function () {
                var _this = this;

                _this.setState({'id': 0});

                _this.resetForm();
                subBillView.showMiddle();
            },
            edit: function (id) {
                var _this = this;
                _this.resetForm();

                var config = {
                    'urlParams': {},
                    'seatParams': {
                        'id': id
                    }
                };

                _this.setState({'id': id});

                sub_billService.subInfo(config, function (res) {
                    if (res.errorCode === 0) {
                        _this.setState({
                            'username': res.data.userName,
                            'name': res.data.fullName,
                            'email': res.data.email,
                            'mobile': res.data.mobilePhone
                        });
                        subBillView.showMiddle();
                    }
                });
            },
            del: function (event) {
                var _this = this;

                var selected = _this.mtable.getSelectData();

                if (!selected.length) {
                    PromptComponent.init({'type': 'warning', 'msg': '请先选择数据！'}).show();
                    return;
                }

                DialogComponent.init({
                    'type': 'delete',
                    'msg': '确定删除？',
                    'success': function () {
                        var params = [];
                        for (var i = 0, l = selected.length; i < l; i++) {
                            params.push(selected[i].id);
                        }

                        var config = {
                            'urlParams': params
                        };

                        sub_billService.subDel(config, function (res) {
                            if (res.errorCode === 0) {
                                _this.search();
                                PromptComponent.init({'type': 'success', 'msg': res.msg}).show();
                            } else {
                                PromptComponent.init({'type': 'warning', 'msg': res.msg}).show();
                            }
                        });
                    }
                }).show();
            },
            locked: function () {
                var _this = this;

                var selected = _this.mtable.getSelectData();

                if (!selected.length) {
                    PromptComponent.init({'type': 'warning', 'msg': '请先选择数据！'}).show();
                    return;
                }

                DialogComponent.init({
                    'type': 'delete',
                    'msg': '确定锁定已选账号？',
                    'success': function () {
                        var params = [];
                        for (var i = 0, l = selected.length; i < l; i++) {
                            params.push(selected[i].id);
                        }

                        var config = {
                            'urlParams': params
                        };

                        sub_billService.subLocked(config, function (res) {
                            if (res.errorCode === 0) {
                                _this.search();
                                PromptComponent.init({'type': 'success', 'msg': res.msg}).show();
                            } else {
                                PromptComponent.init({'type': 'warning', 'msg': res.msg}).show();
                            }
                        });
                    }
                }).show();
            },
            unlocked: function () {
                var _this = this;

                var selected = _this.mtable.getSelectData();

                if (!selected.length) {
                    PromptComponent.init({'type': 'warning', 'msg': '请先选择数据！'}).show();
                    return;
                }

                DialogComponent.init({
                    'type': 'delete',
                    'msg': '确定解锁已选账号？',
                    'success': function () {
                        var params = [];
                        for (var i = 0, l = selected.length; i < l; i++) {
                            params.push(selected[i].id);
                        }

                        var config = {
                            'urlParams': params
                        };

                        sub_billService.subUnLocked(config, function (res) {
                            if (res.errorCode === 0) {
                                _this.search();
                                PromptComponent.init({'type': 'success', 'msg': res.msg}).show();
                            } else {
                                PromptComponent.init({'type': 'warning', 'msg': res.msg}).show();
                            }
                        });
                    }
                }).show();
            },
            repassword: function () {
                var _this = this;

                var selected = _this.mtable.getSelectData();

                if (!selected.length) {
                    PromptComponent.init({'type': 'warning', 'msg': '请先选择数据！'}).show();
                    return;
                }

                DialogComponent.init({
                    'type': 'delete',
                    'msg': '确定重置已选账号？',
                    'success': function () {
                        var params = [];
                        for (var i = 0, l = selected.length; i < l; i++) {
                            params.push(selected[i].id);
                        }

                        var config = {
                            'urlParams': params
                        };

                        sub_billService.subRePassword(config, function (res) {
                            if (res.errorCode === 0) {
                                _this.search();
                                PromptComponent.init({'type': 'success', 'msg': res.msg}).show();
                            } else {
                                PromptComponent.init({'type': 'warning', 'msg': res.msg}).show();
                            }
                        });
                    }
                }).show();
            },
            cancel: function () {
                subBillView.hideMiddel();
            },
            save: function () {
                var _this = this;

                var reg = /^([A-Za-z\s\u4E00-\u9FA5]+)+$/;
                if(!$.trim(_this.state.name) || !reg.test(_this.state.name)){
                    this.state.nameError = true;
                    this.state.nameErrorMsg = '请输入中英文、空格';
                    this.setState();
                    return;
                }

                reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                if (!$.trim(_this.state.email) || !reg.test(_this.state.email)) {
                    this.state.emailError = true;
                    this.state.emailErrorMsg = '邮箱格式不正确';
                    this.setState();
                    return;
                }

                reg = /^([\d\s\-\+\(\)]+)+$/;
                if(!$.trim(_this.state.mobile) || !reg.test(_this.state.mobile)){
                    this.state.mobileError = true;
                    this.state.mobileErrorMsg = '请输入数字、空格和符号()-+';
                    this.setState();
                    return;
                }

                if (_this.state.nameError || _this.state.emailError || _this.state.mobileError) {
                    return;
                }
                if (_this.state.usernameansyc || _this.state.emailansyc || _this.state.mobileansyc) {
                    return;
                }
                var config = {
                    'urlParams': {
                        'email': _this.state.email,
                        'fullName': _this.state.name,
                        'userName': _this.state.username,
                        'mobilePhone': _this.state.mobile
                    }
                };

                if (_this.state.id) {    //编辑
                    config.urlParams.id = _this.state.id;
                    sub_billService.saveEdit(config, function (res) {
                        if (res.errorCode === 0) {
                            subBillView.hideMiddel();
                            _this.search();
                            PromptComponent.init({'type': 'success', 'msg': res.msg}).show();
                        } else {
                            PromptComponent.init({'type': 'warning', 'msg': res.msg}).show();
                        }
                    });
                } else {    //新增
                    if (!_this.state.username || _this.state.usernameError) {
                        return;
                    }
                    sub_billService.saveAdd(config, function (res) {
                        if (res.errorCode === 0) {
                            subBillView.hideMiddel();
                            _this.search();
                            PromptComponent.init({'type': 'success', 'msg': res.msg}).show();
                        } else {
                            PromptComponent.init({'type': 'warning', 'msg': res.msg}).show();
                        }
                    });
                }
            },
            ansycCheck: function (type) {
                var _this = this;

                if (!_this.state[type]) {
                    return;
                }

                switch (type) {
                    case 'username': {
                        if (_this.state.usernameError) {
                            return;
                        }
                        _this.state.usernameansyc = true;    //锁定

                        var config = {
                            urlParams: {
                                'userName': _this.state.username,
                                'userId': _this.state.id
                            }
                        };
                        sub_billService.checkUsername(config, function (res) {
                            if (res.errorCode == 0) {
                                _this.state.usernameansyc = false;
                                _this.setState({'usernameErrorMsg': ''});
                            } else {
                                _this.setState({'usernameErrorMsg': res.msg});
                            }
                        });
                        break;
                    }
                    case 'email': {
                        if (_this.state.emailError) {
                            return;
                        }
                        _this.state.emailansyc = true;    //锁定

                        var config = {
                            urlParams: {
                                'email': _this.state.email,
                                'userId': _this.state.id
                            }
                        };
                        sub_billService.checkEmail(config, function (res) {
                            if (res.errorCode == 0) {
                                _this.state.emailansyc = false;
                                _this.setState({'emailErrorMsg': ''});
                            } else {
                                _this.setState({'emailErrorMsg': res.msg});
                            }
                        });

                        break;
                    }
                    case 'mobile': {
                        if (_this.state.mobileError) {
                            return;
                        }

                        var config = {
                            urlParams: {
                                'mobilePhone': _this.state.mobile,
                                'userId': _this.state.id
                            }
                        };
                        sub_billService.checkMobile(config, function (res) {
                            if (!res.data) {
                                _this.state.mobileansyc = false;
                                _this.setState({'mobileErrorMsg': ''});
                            } else {
                                _this.state.mobileansyc = true;    //锁定
                                _this.setState({'mobileErrorMsg': '手机号已经存在，请重新输入！'});
                            }
                        });

                        break;
                    }
                }
            },
            changeValue: function (event) {
                var _this = this;
                var obj = {},
                    name = event.target.name,
                    value = event.target.value,
                    type = event.target.id;
                switch (type) {
                    case 'username': {
                        _this.setState({'username': $('#username').val()});
                        _this.state.username = $('#username').val();
                        break;
                    }
                    case 'name': {
                        _this.setState({'name': $('#name').val()});
                        _this.state.name = $('#name').val();
                        break;
                    }
                    case 'email': {
                        _this.setState({'email': $('#email').val()});
                        _this.state.email = $('#email').val();
                        break;
                    }
                    case 'mobile': {
                        _this.setState({'mobile': $('#mobile').val()});
                        _this.state.mobile = $('#mobile').val();
                        break;
                    }
                }

                _this.regCheck(event, type);
            },
            resetForm: function () {
                var _this = this;

                _this.setState({
                    'username': '',
                    'usernameError': false,
                    'usernameansyc': false,
                    'usernameErrorMsg': '',
                    'name': '',
                    'nameError': false,
                    'nameErrorMsg': '',
                    'email': '',
                    'emailError': false,
                    'emailansyc': false,
                    'emailErrorMsg': '',
                    'mobile': '',
                    'mobileError': false,
                    'mobileansyc': false,
                    'mobileErrorMsg': ''
                });
            },
            onPageChange: function (pageIndex, pageSize) {
                var _this = this;

                _this.restData.pageIndex = pageIndex;
                _this.restData.pageSize = pageSize;

                _this.search();
            },
            regCheck: function (event, type) {
                var _this = this,
                    reg = /^([\w_\-]+)+$/;

                switch (type) {
                    case 'username': {
                        var value = _this.state.username,
                            usernameError = false,
                            usernameErrorMsg = '';

                        if (!reg.test(value)) {
                            usernameError = true;
                            usernameErrorMsg = '请输入大小写英文、数字和符号“-”、“_”';
                        }
                        _this.setState({usernameError: usernameError, usernameErrorMsg: usernameErrorMsg})
                        break;
                    }
                    case 'name': {
                        reg = /^([A-Za-z\s\u4E00-\u9FA5]+)+$/;
                        var value = _this.state.name,
                            nameError = false,
                            nameErrorMsg = '';

                        if (!reg.test(value)) {
                            nameError = true;
                            nameErrorMsg = '请输入中英文、空格';
                        }
                        _this.setState({nameError: nameError, nameErrorMsg: nameErrorMsg});
                        break;
                    }
                    case 'email': {
                        reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                        var value = _this.state.email,
                            emailError = false,
                            emailErrorMsg = '';

                        if (!reg.test(value)) {
                            emailError = true;
                            emailErrorMsg = '邮箱格式不正确';
                        }
                        _this.setState({emailError: emailError, emailErrorMsg: emailErrorMsg});
                        break;
                    }
                    case 'mobile': {
                        reg = /^([\d\s\-\+\(\)]+)+$/;
                        var value = $.trim(_this.state.mobile),
                            mobileError = false,
                            mobileErrorMsg = '';

                        if (!reg.test(value)) {
                            mobileError = true;
                            mobileErrorMsg = '请输入数字、空格和符号()-+';
                        }
                        _this.setState({mobileError: mobileError, mobileErrorMsg: mobileErrorMsg});
                        break;
                    }
                }
            }
        });
        if (typeof ReactDOM != "undefined") {
            ReactDOM.render(<PageComponent data={storage}/>, document.getElementById('container'));
        }
        module.exports = PageComponent;
    });
